<template>
	
	<!-- <view>
		<input type="text" name="sousuo">
	</view> -->
	
	<!-- <div>
		<input type="text" style="background-color: aliceblue;" name="sousuo"/>
	</div> -->
	
	<view>
		<view class="box">
			<view class="box-item">1</view>
			<view class="box-item">2</view>
			<view class="box-item">3</view><!-- 
			<view class="box-item">4</view>
			<view class="box-item">5</view>
			<view class="box-item">6</view> -->
		</view>
	</view>
	
</template>

<script>
</script>

<style>
	.box{
		
		width: 100%;
		height: 500upx;
		border: 1upx solid #333333;
		display: flex;
		
		align-items: center;
		justify-content: center;
		flex-direction: column;
		flex-wrap: wrap; /* 换行 */
		
	}
	.box-item{
		/* background: #007AFF; */
		color: #FFFFFF;
		height: 200upx;
		width: 200upx;
		/* line-height: 200upx; */
		font-size: 30upx;
		font-weight: bold;
		flex: 1;
		/* text-align: center; */
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.box-item:nth-of-type(odd){
		background: #007AFF;
	}
	.box-item:nth-of-type(even){
		background: #09BB07;
	}
	/* .box-item:first-of-type{
		flex-shrink: 0;
	} */
</style>